<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>  
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
	<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">       
	<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
	<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
        <title>Nueva Venta</title>
        <style>
            #salida {
                background-color: #ccc;
            }

            #salida table tbody tr input {
                background: transparent;
                border: 1px solid transparent;
            }

            #salida table tbody tr input:hover {
                border: 1px solid black;
            }

            #salida table tbody tr input:focus {
                background: white;
            }

            input[type=number]::-webkit-inner-spin-button, 
            input[type=number]::-webkit-outer-spin-button { 
                -webkit-appearance: none; 
                margin: 0; 
            }
        </style>
    </head>
    <body class="container">
        <%@include file="../opciones.jsp"%>
        <h1>Nueva Venta</h1>
        <form class="form-inline" role="form">
            <div class="col-md-3 form-group">
                <label class="sr-only" for="nombre">Código Producto:</label>
                <input type="text" id="nombre" class="form-control" placeholder="Código Producto">
            </div>
            <div class="col-md-1 form-group">
                <label for="cantidad" class="control-label">Cantidad:</label>
            </div>
            <div class="col-md-3 form-group">

                <input type="number" id="cantidad" class="form-control" value="1" placeholder="Cantidad">
            </div>    
            <div class="col-md-2 form-group"></div>
            <button type="submit" id="ajax" class="col-md-3 btn btn-success">Agregar Producto</button>
        </form>

        <br/><br/>
        <div id="salida">
            <table class="table table-hover">
                <thead>
                <th>Codigo</th>
                <th>Nombre</th>
                <th>Cantidad</th>
                <th>Precio Unitario</th>
                <th>Sub Total</th>
                <th>Opción</th>
                </thead>

                <tbody>
                </tbody>
            </table>
        </div>
        <!-- Modulo Total Ventas y descuentos -->

        <form id="form_venta" method="POST" action="<c:url value="/FinalizarVenta"/>" class="form-inline" role="form">
            <div class="col-md-7 form-group">
                Total Venta: <p id="total_venta"></p>
            </div>
            <div class="col-md-1 form-group">
                <label for="descuento">Descuento:</label>
            </div>
            <div class="col-md-2 form-group">
                <input type="number" name="DESCUENTO" id="descuento" class="form-control" value="0">        
            </div>
            <button type="submit" id="venta" class="col-md-2 btn btn-success">Realizar Venta</button>

        </form>

        <script>
                $(document).ready(function(){
                    $('#descuento').val(0);
                });
                $('#form_venta').submit(function(e){
			e.preventDefault();
			var ventaDescuento = $('#descuento').val();
			var totalVenta = $('#total_venta').text();
                        ventaDescuento = parseInt(ventaDescuento);
                        totalVenta = parseInt(totalVenta);
                        console.log(totalVenta, ventaDescuento);
			if (ventaDescuento <= totalVenta) {
                            $(this).unbind('submit').submit();
                            } else {
                                    alert('El descuento no puede ser superior al precio de venta. Porfavor ingrese un descuento valido.')
                                    $('#descuento').val(0);
                                    $('#descuento').focus();
                           }
		});
            
   
            var subtotal = 0;
            
            
            function modificar_total(){
                 var sum = 0;
                 $('table tbody tr td:nth-child(5)').each(function(){
                    sum = sum + parseInt($(this).text());
                    });
                 $('#total_venta').text(sum);
                 
             };
            //cambia cantidad
            $('#salida table tbody').on('focusin.input','tr input', function(){
               console.log('focuseado'); 
               cant_ant = $(this).val();               
               console.log('cantidad ant:' + cant_ant);
               $(this).on('keyup.enter', function(e) {
                   if (e.which === 13) {
                   cantidad = $(this).val();
                   codigo = $(this).parent().parent().find('td').eq(0).text();
                   console.log('codigo:' +codigo);
                   precio_unitario = $(this).parent().parent().find('td').eq(3).text();
                   var data = "COD_PRODUCTO=" + codigo + "&CANTIDAD=" + cantidad;   
                   sub_total = cantidad * precio_unitario;
                   console.log('subtotal: ' + sub_total);
                   $(this).parent().parent().find('td').eq(4).text(sub_total);
                   $.ajax(
                                {
                                    url: "/TT2/EditarCantidad",
                                    type: 'GET',
                                    dataType: 'json',
                                    data: data,
                                    contentType: 'application/json',
                                    mimeType: 'application/json',
                                    success: function(data) {
                                        if (data.OK) {
                                            console.log("Se ha cambiado la cantidad a " + cantidad);
                                            cant_ant = cantidad;
                                            console.log('cantidad ant:' + cant_ant);
                                            console.log('precio: ' + precio_unitario);
                                            modificar_total();
                                            
                                            $('input#nombre').focus();  
                                        }
                                    },
                                    error: function(data, status, er) {
                                        alert("error: " + data + " status: " + status + " er:" + er);
                                    }
                                }
                        );
                                            
                                           
               };
           });
    });
            
            $('#salida table tbody').on('focusout','tr input', function(){
               console.log('lost focus'); 
               console.log('cant anterior:' + cant_ant);
               $(this).val(cant_ant);
               $(this).unbind();
            });
                
            // Eliminando registros de la tabla
            $('#salida table tbody').on('click', 'tr a', function(event) {
                event.preventDefault();
                var fila = $(this).closest('tr');
                var codigo_eliminar = fila.find('td').eq(0).text();
                var subtotal_eliminar = fila.find('td').eq(4).text();
                var data = "COD_PRODUCTO=" + codigo_eliminar;
                $.ajax(
                        {
                            url: "/TT2/EliminarProductoVenta",
                            type: 'GET',
                            dataType: 'json',
                            data: data,
                            contentType: 'application/json',
                            mimeType: 'application/json',
                            success: function(data) {
                                if (data.OK) {
                                    console.log("Se ha eliminado el producto");
                                    modificar_total();
                                }
                            },
                            error: function(data, status, er) {
                                alert("error: " + data + " status: " + status + " er:" + er);
                            }
                        }
                );
                
                $(this).closest('tr').remove();
            });

            // No al scroll en los type=number
            $('body').on('mousewheel', 'input[type=number]', function() {
                $(this).blur();
            });
            
            //oprime el boton agregar producto
            $('button#ajax').click(function(event) {
                event.preventDefault();
                //recopilar datos de los inputs a mandar
                var codigo = $('input#nombre').val();
                //ver si el código existe en la tabla
                var cantidad = $('input#cantidad').val();
                var data = "COD_PRODUCTO=" + codigo + "&CANTIDAD=" + cantidad;
                var igualdad = 0;
                if (codigo) {
                   /* $('table > tbody > tr').each(function(index){
                        console.log(index + 'codigo' +$('table tbody tr').find('td').eq(0).text());
                        if (codigo == $('table tbody tr').find('td').eq(0).text()){
                            igualdad = 1;
                            
                        };
                      });
                      console.log(igualdad);
                      */
                   // if (igualdad == 0) {
                    //Agregar producto ajax por append
                    $.ajax(
                            {                                
                                url: "/TT2/AgregarProductoVenta",
                                type: 'GET',
                                dataType: 'json',
                                data: data,
                                contentType: 'application/json',
                                mimeType: 'application/json',
                                success: function(data) {
                                                
                                    console.log(data);
                                    var precio = data.VALOR_VENTA;
                                    var nombre = data.NOMBRE;
                                    var total = (precio * cantidad);
                                    var registro = '<tr>'
                                            + '<td id="codigo_td">'+ codigo + '</td>'
                                            + '<td>' + nombre + '</td>'
                                            + '<td><input type="number" value="' + cantidad + '"></td>'
                                            + '<td>' + precio + '</td>'
                                            + '<td>' + total + '</td>'
                                            + '<td><a href="#">Eliminar</a></td>'
                                            + '</tr>';
                                    $('#salida table tbody').append(registro);
                                    $('#nombre').val('');
                                    $('input#cantidad').val('1');
                                    $('input#nombre').focus();
                                    modificar_total();
                                },
                                error: function(data, status, er) {
                                    console.log("error: " + data + " status: " + status + " er:" + er);
                                    alert('El código a ingresar no existe, porfavor ingrese un código valido');
                                }
                            }
                    );
                    //Termina ajax
                //termina el if de igualdad
          //  } else {
                    /*$('table tbody tr').each(function(){
                        if (codigo == $(this).find('td').eq(0).text()){
                           old_cantidad = $(this).find('td').eq(2).children().val();
                           console.log('old cantidad:' + old_cantidad);
                           console.log('cantidad : ' + cantidad);
                           new_cantidad = parseInt(cantidad) + parseInt(old_cantidad);
                           console.log('nueva cantidad:' + new_cantidad);
                           //comienza ajax agregar mismo item
                           $.ajax(
                                {
                                    url: "/TT2/EditarCantidad",
                                    type: 'GET',
                                    dataType: 'json',
                                    data: data,
                                    contentType: 'application/json',
                                    mimeType: 'application/json',
                                    success: function(data) {
                                        if (data.OK) {
                                            console.log("Se ha cambiado la cantidad a " + new_cantidad);
                                            cant_ant = new_cantidad;
                                            console.log('cantidad ant:' + cant_ant);
                                            console.log('contenido cantidad:' + $('table tbody tr').find('td').eq(2).children().val());
                                            $('table tbody tr').find('td').eq(2).children().val(new_cantidad);
                                            modificar_total();       
                                                        
                                            $('form input').val('');
                                            $('input#cantidad').val('1');
                                            $('input#nombre').focus();
                                        }
                                    },
                                    error: function(data, status, er) {
                                        alert("error: " + data + " status: " + status + " er:" + er);
                                    }
                                }
                        );
                           //termina ajax agregar mismo item
                        };
                });
            }*/
        } else {
                    alert('No ha ingresado un código. Porfavor ingrese código');
                    $('input#nombre').focus();
                };


            });
            
         
        </script>
    </body>
</html>

